<template>

    <div>
        <input type="text" v-model="msg"> 
        <button @click="addItems">添加</button>
        <ul>
            <li v-for="(item,index) in items" :key="item.id">
            <input type="radio" name="m_radio" :id="item.id">    </input>
            <label :for="item.id">姓名: {{item.name}}</label>
            </li>
        </ul>
    </div>

</template>

<script>
export default {
  data() {
    return {
      msg:"",
      items:[
        {name:"张三",id:1},
        {name:"李四",id:2},
        {name:"王五",id:3},
      ],
      id:4,
    };
  },




  methods: {
    addItems(){
        //加在队首
        this.items.unshift({name:this.msg,id:this.id});
        this.id++;
        this.msg="";
    }
    
    }
};
</script>

<style scoped>

ul{
    list-style: none;
}
</style>